<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>MyIndex</title>
    <link rel="stylesheet" href="._css/bootstrap.css">
    <link rel="stylesheet" href="._css/all.css">
    <link rel="stylesheet" href="._css/myindex.css">
    <script src="._js/all.js"></script>
    <script src="._js/bootstrap.js"></script>
</head>
<body>

<div class="container text-center">
    <!--clock-->
    <div class="row m-3">
        <div class="col-2 col-md-2"></div>
        <div class="col-8 col-md-8 clock">
            <h5 class="mb-4 m-2">
                <i class="fa-solid fa-calendar-days fa-sm text-danger"></i>
                &nbsp;<span id="date" class="text-danger"></span>&nbsp;&nbsp;&nbsp;&nbsp;
                <i class="fa-solid fa-clock fa-spin fa-sm text-info"></i>&nbsp;
                <span id="time" class="text-info"></span>
            </h5>
            <hr>
        </div>
        <div class="col-2 col-md-2"></div>
    </div>



    <div class="row">
        <!-- 切换背景色 -->
        <div class="col-2 col-md-2">
            <button onclick="changeGradient()" class="btn"><i class="fa-solid fa-lightbulb fa-beat"
                                                              style="color: darkcyan;"></i></button>
        </div>
        <!--clock-->
        <div class="col-4 col-md-4">

        </div>

        <!-- 超链接-->
        <div class="col-6 col-md-6">
        </div>

    </div>


    <!-- 搜素引擎 -->
    <div class="row">
        <div class="col-1 col-md-1"></div>
        <div class="col-10 col-md-10">

            <div class="text-center p-4">
                <!--                <img src="./.media/logo-no-background.png" class="rounded" alt="logo" width="40%">-->
                <div class="content">
                    <h2>Cloudb</h2>
                    <h2>Cloudb</h2>
                </div>
            </div>


            <div class="input-group mb-3">
                <input type="text" id="searchQuery" class="form-control" placeholder="请输入搜索的关键">
            </div>


            <div class="btn-group p-2" role="group" aria-label="Basic mixed styles example">
                <button onclick="searchEngine('baidu')" class="btn btn-primary"><i
                        class="fa-solid fa-paw fa-beat fa-sm"></i>&nbsp;百度
                </button>
                <button onclick="searchEngine('google')" class="btn btn-danger"><i
                        class="fa-brands fa-google fa-spin fa-sm"></i>&nbsp;Google
                </button>
                <button onclick="searchEngine('bing')" class="btn btn-success"><i
                        class="fa-brands fa-microsoft fa-spin fa-spin-reverse fa-sm"></i>&nbsp;Bing
                </button>
                <button onclick="searchEngine('f')" class="btn btn-primary"><i
                        class="fa-solid fa-f fa-bounce fa-sm"></i>&nbsp;f
                </button>
                <button onclick="searchEngine('github')" class="btn btn-dark"><i
                        class="fa-brands fa-github fa-beat fa-sm"></i>&nbsp;GitHub
                </button>
                <button onclick="searchEngine('sougou')" class="btn btn-warning"><i
                        class="fa-solid fa-dog fa-shake fa-sm"></i>&nbsp;搜狗
                </button>
                <button onclick="searchEngine('zhihu')" class="btn btn-primary"><i
                        class="fa-solid fa-book-open-reader fa-fade fa-sm"></i>&nbsp;知乎
                </button>
                <button onclick="searchEngine('wechat')" class="btn btn-success"><i
                        class="fa-brands fa-weixin fa-sm"></i>&nbsp;微信
                </button>
                <button onclick="searchEngine('wechatmp')" class="btn btn-info"><i
                        class="fa-solid fa-comments fa-beat-fade fa-sm"></i>&nbsp;微信公众号
                </button>


            </div>
            <p>
            <h6 class="text-danger">Google,Bing Ai ,Google Bard 在中国不能使用!</h6>
            </p>
            <hr>


        </div>
        <div class="col-1 col-md-1"></div>
    </div>


    <!-- Columns are always 50% wide, on mobile and desktop -->
    <div class="row">
        <div class="col-6">
            <a class="btn btn-outline-primary" href="https://chat.baidu.com/" target="_blank">
                <i class="fa-solid fa-b fa-spin"></i> 百度 Ai</a>
            <a class="btn btn-outline-success" href="https://bing.com/new/" target="_blank">
                <i class="fa-brands fa-microsoft fa-spin"></i> Bing Ai</a>
            <a class="btn btn-outline-danger" target="_blank" href="https://bard.google.com/">
                <i class="fa-brands fa-google-plus-g fa-spin"></i> bard</a>
        </div>
        <div class="col-6">
            <p>
                <button class="btn btn-primary" type="button" data-bs-toggle="collapse"
                        data-bs-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
                    <i class="fa-solid fa-lightbulb"></i>
                    技巧
                </button>
            </p>

        </div>
    </div>


    <!-- 搜索技巧 -->
    <div class="row">
        <div class="col-2"></div>
        <div class="col-8">
            <div class="collapse" id="collapseExample">
                <div class="card card-body text-lg-start">
                    <h6><span class="badge bg-danger">1</span> 精准搜索加双引号或者书名号《》.例:"python"</h6>
                    <h6><span class="badge bg-warning">2</span> 指定站点内搜索相关关键词.例:site: 52pojie.cn
                        python</h6>
                    <h6><span class="badge bg-primary">3</span> 标题里包含被搜索的关键字.例:intitle:python</h6>
                    <h6><span class="badge bg-success">4</span> 精准搜索文件类型.例:python filetype:doc </h6>
                    <h6><span class="badge bg-info">5</span> 搜索url中含有关键字的链接:例inurl:python</h6>
                    <h6><span class="badge bg-secondary">6</span> 搜索关键词减号是排除,加号是包含,通配符*,匹配...
                    </h6>
                    <h6><span class="badge bg-dark">7</span> Google搜索按"/"迅速回到搜索框.</h6>
                </div>
            </div>
        </div>
        <div class="col-2"></div>
    </div>


    <!-- Columns are always 50% wide, on mobile and desktop -->
    <!--    <div class="row">-->
    <!--        <div class="col-6">.col-6</div>-->
    <!--        <div class="col-6">.col-6</div>-->
    <!--    </div>-->

    <footer class="py-3 my-4">
        <ul class="nav justify-content-center border-bottom pb-3 mb-3 text-primary">
            <li class="nav-item"><a href="http://cloudb.pub" class="nav-link px-2" target="_blank">
                <i class="fa-solid fa-house" style="color: #1a1e21"></i>&nbsp;Home</a></li>

            <li class="nav-item"><a href="index1.html" class="nav-link px-2 " target="_blank">
                <i class="fa-brands fa-leanpub fa-sm" style="color: #1a1e21"></i>&nbsp;Knowledge</a></li>

            <li class="nav-item"><a href="http://localhost:809" class="nav-link px-2" target="_blank">
                <i class="fa-brands fa-windows fa-sm" style="color: #1a1e21"></i>&nbsp;Soft</a></li>

            <li class="nav-item"><a href="http://localhost:810" class="nav-link px-2 " target="_blank">
                <i class="fa-solid fa-compact-disc fa-sm" style="color: #1a1e21"></i>&nbsp;ISO</a></li>

            <li class="nav-item"><a href="http://localhost:811" class="nav-link px-2" target="_blank">
                <i class="fa-solid fa-swatchbook fa-sm" style="color: #1a1e21"></i>&nbsp;Books</a></li>

            <li class="nav-item"><a href="http://localhost:808" class="nav-link px-2 " target="_blank">
                <i class="fa-solid fa-book-open-reader fa-sm" style="color: #1a1e21"></i>&nbsp;Neat Reader</a></li>

            <li class="nav-item"><a href="http://360.tiandi.com/?td_2_6216" class="nav-link px-2 " target="_blank">
                <i class="fa-brands fa-internet-explorer fa-sm" style="color: #1a1e21"></i>&nbsp;360</a></li>

            <li class="nav-item"><a href="https://github.com/xyz349925756" class="nav-link px-2 " target="_blank"> <i
                    class="fa-brands fa-square-github fa-sm" style="color: #1a1e21"></i>&nbsp;Github</a></li>

            <li class="nav-item"><a href="http://localhost:807" class="nav-link px-2 " target="_blank">
                <i class="fa-solid fa-folder-tree fa-sm" style="color: #1a1e21"></i>&nbsp;Free</a></li>

        </ul>

        <a href="mailto:xyz349925756@hotmail.com" target="_blank" class="text-success"><i
                class="fa-solid fa-envelope"></i></a>&nbsp;&nbsp;

        <a href="http://wpa.qq.com/msgrd?v=3&uin=349925756&site=qq&menu=yes" target="_blank"
           class="text-info"><i class="fa-brands fa-qq"></i></a>&nbsp;&nbsp;

        <a href="tel:18183510256" target="_blank" class="text-success"><i
                class="fa fa-phone "></i></a>&nbsp;&nbsp;

        <p class="text-center text-muted">© 2023
            <a href="https://cloudb.pub" target="_blank">Cloudb.pub</a>, All rights reserved</p>
    </footer>


</div>


<script>
    function changeGradient() {
        var colors = ['#e0ffff', '#f5f5dc', '#ffe4e1', '#f0f8ff', '#f0e68c', '#90d1ee', '#03041965'];
        var randomColor = colors[Math.floor(Math.random() * colors.length)];
        document.body.style.background = "linear-gradient(to right, #e0ffff, " + randomColor + ")";
    }
</script>

<script>
    function searchEngine(engine) {
        var query = document.getElementById("searchQuery").value;
        var url;

        if (engine === "baidu") {
            url = "https://www.baidu.com/s?wd=" + encodeURIComponent(query);
        } else if (engine === "google") {
            url = "https://www.google.com/search?q=" + encodeURIComponent(query);
        } else if (engine === "bing") {
            url = "https://www.bing.com/search?q=" + encodeURIComponent(query);
        } else if (engine === "f") {
            url = "https://fsoufsou.com/search?q=" + encodeURIComponent(query);
        } else if (engine === "github") {
            url = "https://github.com/search?q=" + encodeURIComponent(query);
        } else if (engine === "sougou") {
            url = "https://www.sogou.com/web?query=" + encodeURIComponent(query);
        } else if (engine === "zhihu") {
            url = "https://www.zhihu.com/search?q=" + encodeURIComponent(query);
        } else if (engine === "wechat") {
            url = "https://weixin.sogou.com/weixin?type=2&query=" + encodeURIComponent(query);
        } else if (engine === "wechatmp") {
            url = "https://weixin.sogou.com/weixin?type=1&query=" + encodeURIComponent(query);
        }

        window.open(url, "_blank");
    }

    document.getElementById("searchQuery").addEventListener("keydown", function (event) {
        if (event.key === "Enter") { // 13 表示回车键的键码
            searchEngine("baidu"); // 默认使用百度搜索引擎
            event.preventDefault(); // 阻止默认的回车键行为
        }
    });

</script>

<script>
    const WEEK = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];

    function updateTime() {
        var now = new Date();

        document.getElementById("time").innerText =
            zeroPadding(now.getHours(), 2) + ":" +
            zeroPadding(now.getMinutes(), 2) + ":" +
            zeroPadding(now.getSeconds(), 2);

        document.getElementById("date").innerText =
            now.getFullYear() + "-" +
            zeroPadding(now.getMonth() + 1, 2) + "-" +
            zeroPadding(now.getDate(), 2) + "  " +
            WEEK[now.getDay()];
    }

    updateTime();
    setInterval(updateTime, 1000);

    function zeroPadding(num, digit) {
        return String(num).padStart(digit, '0');
    }

</script>

</body>
</html>